<template>
  <a-card title="我的客户" style="width: 300px">
    <div class="HeadrSearch">
      <!-- 头部搜索框 -->
      <a-input-group compact>
        <a-select v-model:value="SearchType">
          <a-select-option value="公司名称">公司名称</a-select-option>
          <a-select-option value="会员联系方式">会员联系方式</a-select-option>
          <a-select-option value="企业联系方式">企业联系方式</a-select-option>
        </a-select>
        <a-input-search style="width: 20%;" v-model:value="SearchContent" @search="onSearch" placeholder="请输入搜索内容">
          <template #enterButton>
            <a-button><template #icon>
                <SearchOutlined />
              </template></a-button>
          </template>
        </a-input-search>
      </a-input-group>
      <a-button type="primary" size="middle" style="border-radius: 5px;" @click="CreateWhole()">新增企业</a-button>
    </div>
    <div class="TableCentent">
      <a-table bordered class="Tables" :columns="columns" :data-source="data" :pagination="false" :scroll="{ x: 1500 }"
        :row-selection="rowSelection"
        :rowClassName="(record: any, index: any) => (index % 2 === 1 ? 'table-striped' : null)">
        <template #operation="{ record }">
          <a @click="Examine(record, 'ck')" style="margin-left: 13px;">查看</a>
          <a @click="Examine(record, 'sf')" style="margin-left: 13px;">释放</a>
          <a @click="Examine(record, 'gj')" style="margin-left: 13px;">跟进</a>
        </template>
        <template #5="{ record }">
          <span v-if="record.bindingWechat === ''">未绑定</span>
          <span v-else>{{ record.bindingWechat }}</span>
        </template>
        <template #6="{ record }">
          <span v-if="(record.clientGrade === 0)">新客户</span>
          <span v-else-if="(record.clientGrade === 1)">成熟期客户</span>
          <span v-else-if="(record.clientGrade === 2)">维持期客户</span>
          <span v-else-if="(record.clientGrade === 3)">稳定期客户</span>
          <span v-else>成长期客户</span>
        </template>
        <template #7="{ record }">
          <span v-if="(record.enterpriseSetmeal === 0)">云企测试套餐</span>
          <span v-else-if="(record.enterpriseSetmeal === 1)">半年会员</span>
          <span v-else-if="(record.enterpriseSetmeal === 2)">免费会员</span>
          <span v-else-if="(record.enterpriseSetmeal === 3)">月度会员</span>
          <span v-else-if="(record.enterpriseSetmeal === 4)">季度会员</span>
          <span v-else>年度会员</span>
        </template>
        <template #18="{ record }">
          <span v-if="(record.authenticationStatus === 0)">未认证</span>
          <span v-else-if="(record.authenticationStatus === 1)" style="color: #67c23a;">已认证</span>
          <span v-else style="color: #f56c6c;">未通过</span>
        </template>
        <template #19="{ record }">
          <span v-if="(record.displayStatus === false)" style="color: #f56c6c;">不显示</span>
          <span v-else style="color: #67c23a;">显示中</span>
        </template>
        <template #20="{ record }">
          <span v-if="(record.finallyFollowup === '')">-</span>
          <span v-else>{{ record.finallyFollowup }}</span>
        </template>
        <template #21="{ record }">
          <span v-if="(record.notFollowup === '')">-</span>
          <span v-else>{{ record.notFollowup }}</span>
        </template>
      </a-table>
      <div style="display: flex; margin-top: 20px;">
        <a-button type="primary">全选 / 反选</a-button>
        <a-button style="margin-left: 20px;" type="primary">释放</a-button>
        <a-button style="margin-left: 20px;" type="primary">认证</a-button>
        <a-button style="margin-left: 20px;" type="primary">显示</a-button>
        <a-button style="margin-left: 20px;" type="primary">刷新职位</a-button>
        <a-button style="margin-left: 20px;" type="primary">导出</a-button>
        <a-pagination style="align-self: center; position: absolute; right: 20px;" size="small" :total="total"
          show-size-changer show-quick-jumper :show-total="(total: any) => `总共
          ${total} 项`" :pageSizeOptions="['1', '3', '5', '10']" v-model:pageSize="pageSize"
          v-model:current="current" />
      </div>
    </div>
    <a-drawer width="1000" placement="right" :closable="false" v-model:visible="visible">
      <div class="drawerHeater">
        <el-row style="align-items: center;" :gutter="20">
          <el-col :span="4" class="drawerHeater-left">
            <a-image src="https://i.postimg.cc/qvMCN7DZ/4.jpg" />
          </el-col>
          <el-col :span="20" class="drawerHeater-right">
            <div class="drawerHeater-right-top">
              <h3>{{
                  form.formAllclinent.enterpriseName
              }}</h3>
              <p style="color: #777777;">( 企业ID： 1； <a style="color: #0078ff;">一键登录企业会员中心</a> )</p>

            </div>
            <div>
              <a-row>
                <a-col :span="8"><span style="color: #777; font-size: 14px; font-weight: 400;">所属销售：</span><span>{{
                    form.formAllclinent.involvedMarket
                }}</span>
                </a-col>
                <a-col :span="8"><span style="color: #777; font-size: 14px; font-weight: 400;">会员套餐：</span><span>{{
                    form.formAllclinent.enterpriseSetmeal
                }}</span>
                </a-col>
                <a-col :span="8"><span style="color: #777; font-size: 14px; font-weight: 400;">跟进记录：</span><span>{{
                    form.formAllclinent.notFollowup === "" ? "0" : form.formAllclinent.notFollowup
                }}</span>
                </a-col>
              </a-row>
              <a-row>
                <a-col :span="8"><span style="color: #777; font-size: 14px; font-weight: 400;">客户等级：</span><span>{{
                    form.formAllclinent.clientGrade
                }}</span>
                </a-col>
                <a-col :span="8"><span style="color: #777; font-size: 14px; font-weight: 400;">到期时间：</span><span>{{
                    form.formAllclinent.setmealResidue
                }}</span>
                </a-col>
                <a-col :span="8"><span style="color: #777; font-size: 14px; font-weight: 400;">最后跟进：</span><span>{{
                    form.formAllclinent.finallyFollowup === "" ? "-" : form.formAllclinent.finallyFollowup
                }}</span>
                </a-col>
              </a-row>
            </div>
            <div>
              <span style="color: #777; font-size: 14px; font-weight: 400;">服务号绑定状态：</span>
              <a><img style="width: 20px; height: 20px; vertical-align: auto;" src="@/assets/微信.png" alt=""></a>
              <a style="color: #0078ff; margin-left: 10px;">邀请绑定</a>
              <a style="color: #0078ff; margin-left: 10px;">刷新结果</a>
            </div>
          </el-col>
        </el-row>
      </div>
      <div class="drawerTab">
        <a-tabs v-model:activeKey="activeKey" tabBarStyle="{background: #fcfcfc;}">
          <a-tab-pane key="1" tab="跟进记录">
            <a-row>
              <a-col :span="12">
                <a-form ref="formRef" :labelCol="{ span: 4, offset: 0 }" :wrapperCol="{ span: 18, offset: 1 }">
                  <a-form-item label="跟进方式" name="region">
                    <a-select placeholder="请选择">
                      <a-select-option value="当面拜访">当面拜访</a-select-option>
                      <a-select-option value="电话拜访">电话拜访</a-select-option>
                      <a-select-option value="网络拜访">网络拜访</a-select-option>
                      <a-select-option value="其他拜访">其他拜访</a-select-option>
                    </a-select>
                  </a-form-item>
                  <a-form-item ref="name" label="联系人" name="name">
                    <a-select placeholder="请选择">
                      <a-select-option value="shanghai">{{ form.formAllclinent.contacts }} &nbsp; | &nbsp; {{
                          form.formAllclinent.memberContactWay
                      }}</a-select-option>
                    </a-select>
                  </a-form-item>
                  <a-form-item ref="name" label="下次跟进时间" name="name">
                    <a-date-picker show-time type="date" placeholder="选择日期时间" style="width: 100%" />
                  </a-form-item>
                  <a-form-item label="跟进结果" name="desc">
                    <a-textarea :rows="6" />
                  </a-form-item>
                  <a-form-item label="添加图片" name="desc">
                    <a-upload-dragger name="file" :multiple="true"
                      action="https://www.mocky.io/v2/5cc8019d300000980a055e76" @change="handleChange">
                      <p class="ant-upload-drag-icon">
                        <UploadOutlined twoToneColor="#c0c4cc" />
                      </p>
                      <p style="font-size: 14px;">将图片拖到此处，或<span style="color: #409eff;">点击上传</span></p>
                      <p style="font-size: 14px;">
                        图片上传仅支持jpg/png格式
                      </p>
                    </a-upload-dragger>
                  </a-form-item>
                  <a-form-item :wrapper-col="{ span: 14, offset: 5 }">
                    <a-button type="primary" @click="onSubmit">保存跟进记录</a-button>
                  </a-form-item>
                </a-form>
              </a-col>
              <a-col style="border-left: 1px solid #ebeef5;" :span="12">
                <div
                  style="width: 100%; padding: 10px; padding-top: 0; font-size: 14px; font-weight: 600; border-bottom: 1px solid #ebeef5;">
                  历史跟进<span style="position: absolute; right: 0; font-weight: 400; color: #666666;">共有 <span
                      style="color: #6ea7d9;"> 0条 </span> 跟进</span>
                </div>
              </a-col>
            </a-row>
          </a-tab-pane>
          <a-tab-pane key="2" tab="客户详情" force-render>
            <a-row>
              <a-col :span="12">
                <ul class="drawerTab_Ul">
                  <li>
                    <label style="display: inline-block; width: 90px;">客户等级：</label>
                    <a-radio-group size="middle" v-model:value="RadioclientGrade">
                      <a-radio-button value="0">新客户</a-radio-button>
                      <a-radio-button value="1">成长期客户</a-radio-button>
                      <a-radio-button value="2">成熟期客户</a-radio-button>
                      <a-radio-button value="3">维持期客户</a-radio-button>
                      <a-radio-button value="5">稳定期客户</a-radio-button>
                    </a-radio-group>
                    <a-select size="middle" ref="select" v-model:value="RadioclientGrade" style="width: 105px"
                      @focus="focus" @change="handleChange" placeholder="完成">
                      <a-select-option value="6">流失客户</a-select-option>
                      <a-select-option value="7">成交客户</a-select-option>
                    </a-select>
                  </li>
                  <li>
                    <label style="display: inline-block; width: 90px;">客户标签：</label>
                    <span>-</span>
                    <span style="position: absolute; right: 0;"><a-button type="dashed">配置</a-button></span>
                  </li>
                  <li>
                    <label style="display: inline-block; width: 90px;">企业账号：</label> <span>-</span>
                    <span style="position: absolute; right: 75px;"><a-button type="dashed">锁定</a-button></span>
                    <span style="position: absolute; right: 0;"><a-button type="dashed">改密</a-button></span>
                  </li>
                  <li>
                    <label style="display: inline-block; width: 90px;">会员手机：</label> <span>{{
                        form.formAllclinent.memberContactWay
                    }}</span> <span><img style="width: 15px; height: 15px; vertical-align: sub;"
                        src="@/assets/phone电话.png" alt=""></span> <span><img
                        style="width: 14px; height: 14px; vertical-align: sub;" src="@/assets/info.png" alt=""></span>
                    <span style="color: #c9c9c9; font-size: 9px; margin-left: 5px;  ">会员登录手机号</span>
                    <span style="position: absolute; right: 0;"><a-button type="dashed">修改</a-button></span>
                  </li>
                  <li>
                    <label style="display: inline-block; width: 90px;">企业手机：</label> <span>{{
                        form.formAllclinent.enterpriseContactWay
                    }}</span> <span><img style="width: 15px; height: 15px; vertical-align: sub;"
                        src="@/assets/phone电话.png" alt=""></span> <span><img
                        style="width: 14px; height: 14px; vertical-align: sub;" src="@/assets/info.png" alt=""></span>
                    <span style="color: #c9c9c9; font-size: 9px; margin-left: 5px;">企业登录手机号</span>
                    <span style="position: absolute; right: 0;"><a-button type="dashed">修改</a-button></span>
                  </li>
                  <li>
                    <label style="display: inline-block; width: 90px;">显示状态：</label>
                    <span style="color: #67c23a;" v-if="form.formAllclinent.displayStatus">显示中</span>
                    <span style="color: #f56c6c;" v-else>未显示</span>
                    <span style="position: absolute; right: 0;"><a-button type="dashed">修改显示状态</a-button></span>
                  </li>
                  <li>
                    <label style="display: inline-block; width: 90px;">会员邮箱：</label> <span>-</span>
                    <span style="position: absolute; right: 0;"><a-button type="dashed">修改</a-button></span>
                  </li>
                  <li>
                    <label style="display: inline-block; width: 90px;">备注信息：</label> <span>-</span>
                    <span style="position: absolute; right: 0;"><a-button type="dashed">修改</a-button></span>
                  </li>
                  <li style="width: 100%; height: 100%;">
                    <label style="display: inline-block; width: 90px;">企业认证：</label>
                    <span style="position: absolute; right: 0;"><a-button type="dashed">审核营业执照</a-button></span>
                    <div
                      style="width: 100%; margin-bottom: 20px; display: grid; align-items:center; justify-content: center;">
                      <a-image :width="150" :height="120" src="https://www.antdv.com/#error"
                        fallback="http://houtai.74cmsse.tywangcai.com/admin/static/img/zanwei.15584ae2.png" />
                      <div style="color: #d1cfcf; font-size: 12px; text-align: center;">
                        暂未上传企业认证资料
                      </div>
                    </div>
                  </li>
                  <li style="width: 100%; height: 100%;">
                    <label style="display: inline-block; width: 90px;">企业风采：</label>
                    <span style="position: absolute; right: 75px;"><a-button disabled type="dashed">审核</a-button></span>
                    <span style="position: absolute; right: 0;"><a-button disabled danger>删除</a-button></span>
                    <div
                      style="width: 100%; margin-bottom: 20px; display: grid; align-items:center; justify-content: center;">
                      <a-image :width="150" :height="120" src="https://www.antdv.com/#error"
                        fallback="http://houtai.74cmsse.tywangcai.com/admin/static/img/zanwei.15584ae2.png" />
                      <div style="color: #d1cfcf; font-size: 12px; text-align: center;">
                        暂未上传企业风采图片
                      </div>
                    </div>
                  </li>
                </ul>
              </a-col>
              <a-col style="padding-left: 40px;" :span="12">
                <a-card style="width: 300px">
                  <p style="font-size: 18px; font-weight: 700; text-align: center; padding-top: 10px;">企业套餐情况</p>
                  <a-row style="margin-top: 10px;">
                    <a-col :span="12">
                      <span style="color: #ababac;">会员套餐：</span><span>
                        <span v-if="(form.formAllclinent.enterpriseSetmeal === '0')">云企测试套餐</span>
                        <span v-else-if="(form.formAllclinent.enterpriseSetmeal === '1')">半年会员</span>
                        <span v-else-if="(form.formAllclinent.enterpriseSetmeal === '2')">免费会员</span>
                        <span v-else-if="(form.formAllclinent.enterpriseSetmeal === '3')">月度会员</span>
                        <span v-else-if="(form.formAllclinent.enterpriseSetmeal === '4')">季度会员</span>
                        <span v-else>年度会员</span>
                      </span>
                    </a-col>
                    <a-col :span="12">
                      <span style="color: #ababac;">套餐剩余：</span><span>{{ form.formAllclinent.setmealResidue }}</span>
                    </a-col>
                  </a-row>
                  <a-row style="margin-top: 10px;">
                    <a-col :span="12">
                      <span style="color: #ababac;">职位并发数：</span><span>1条</span>
                    </a-col>
                    <a-col :span="12">
                      <span style="color: #ababac;">免费刷新职位：</span><span>三次/天</span>
                    </a-col>
                  </a-row>
                  <a-row style="margin-top: 10px;">
                    <a-col :span="12">
                      <span style="color: #ababac;">职聊次数：</span><span>3次</span>
                    </a-col>
                    <a-col :span="12">
                      <span style="color: #ababac;">下载简历上限：</span><span>三份/天</span>
                    </a-col>
                  </a-row>
                  <a-row style="margin-top: 10px;">
                    <a-col :span="12">
                      <span style="color: #ababac;">每日职聊上限：</span><span>1/天</span>
                    </a-col>
                    <a-col :span="12">
                      <span style="color: #ababac;">简历点：</span><span>1(套餐包)+0(资源包)</span><span
                        style="margin-left: 10px; color: #409eff;">使用记录</span>
                    </a-col>
                  </a-row>
                  <a-row style="margin-top: 10px;">
                    <a-col :span="12">
                      <span style="color: #ababac;">账户积分：</span><span>100 积分</span><span
                        style="margin-left: 10px; color: #409eff;">使用记录</span>
                    </a-col>
                  </a-row>
                </a-card>
                <ul class="drawerTab_Ul">
                  <li>
                    <label style="font-weight: 700; color: black;">系统信息</label>
                  </li>
                  <li>
                    <label style="display: inline-block; width: 110px;">所属销售：</label><span>{{
                        form.formAllclinent.involvedMarket
                    }}</span>
                    <span style="position: absolute; right: 0;"><a-button type="dashed">转交记录</a-button></span>
                  </li>
                  <li>
                    <label style="display: inline-block; width: 110px;">跟进记录：</label><span>{{
                        form.formAllclinent.notFollowup === "" ? "0" : form.formAllclinent.notFollowup
                    }}</span>
                  </li>
                  <li>
                    <label style="display: inline-block; width: 110px;">最后跟进时间：</label><span>-</span>
                  </li>
                  <li>
                    <label style="display: inline-block; width: 110px;">最后跟进人：</label><span>-</span>
                  </li>
                  <li>
                    <label style="display: inline-block; width: 110px;">获得客户时间：</label><span>-</span>
                  </li>
                  <li>
                    <label style="display: inline-block; width: 110px;">企业登录时间：</label><span>-</span>
                  </li>
                </ul>
              </a-col>
            </a-row>
          </a-tab-pane>
          <a-tab-pane key="3" tab="企业资料" force-render>
            <a-row>
              <a-col style="border-right: 1px solid #ebeef5;" :span="12">
                <div style="font-weight: 800; font-size: 18px;">
                  企业资料
                </div>
                <a-form :model="form.formAllclinent" :label-col="labelCol" :wrapper-col="wrapperCol">

                  <a-divider style="font-weight: 700;" orientation="left">企业信息</a-divider>
                  <a-form-item ref="enterpriseName" label="公司名称" name="enterpriseName">
                    <a-input v-model:value="form.formAllclinent.enterpriseName" placeholder="请输入" />
                  </a-form-item>

                  <a-form-item ref="enterpriseAbbreviation" label="公司简称" name="enterpriseAbbreviation">
                    <a-input v-model:value="form.formAllclinent.enterpriseAbbreviation" placeholder="请输入" />
                  </a-form-item>

                  <a-form-item label="认证状态">
                    <a-radio-group v-model:value="form.formAllclinent.authenticationStatus">
                      <a-radio value="1">带审核</a-radio>
                      <a-radio value="2">已认证</a-radio>
                      <a-radio value="3">未通过</a-radio>
                    </a-radio-group>
                  </a-form-item>

                  <a-form-item label="logo" style="display: flex">
                    <a-upload v-model:file-list="form.formAllclinent.logo" name="avatar" list-type="picture-card"
                      :show-upload-list="false" action="https://www.mocky.io/v2/5cc8019d300000980a055e76"
                      :before-upload="beforeUpload" @change="handleChanges">
                      <img v-if="imageUrl" :src="imageUrl" alt="avatar" />
                      <div v-else>
                        <loading-outlined v-if="loading"></loading-outlined>
                        <plus-outlined v-else></plus-outlined>
                        <div class="ant-upload-text">
                          <PlusCircleOutlined style="color: #8c939d; fontSize: 4rem" />
                        </div>
                      </div>
                    </a-upload>
                    <div>建议上传120*120的图片</div>
                  </a-form-item>

                  <a-form-item label="公司性质" name="enterpriseNature">
                    <a-select placeholder="请选择" v-model:value="form.formAllclinent.enterpriseNature">
                      <a-select-option value="国企">国企</a-select-option>
                      <a-select-option value="民营">民营</a-select-option>
                      <a-select-option value="合资">合资</a-select-option>
                      <a-select-option value="外商独资">外商独资</a-select-option>
                      <a-select-option value="股份制企业">股份制企业</a-select-option>
                      <a-select-option value="上市公司">上市公司</a-select-option>
                      <a-select-option value="国家机关">国家机关</a-select-option>
                      <a-select-option value="事业单位">事业单位</a-select-option>
                      <a-select-option value="其他">其他</a-select-option>
                    </a-select>
                  </a-form-item>

                  <a-form-item label="公司规格" name="CompanySpecification">
                    <a-select placeholder="请选择" v-model:value="form.formAllclinent.CompanySpecification">
                      <a-select-option value="20人以下">20人以下</a-select-option>
                      <a-select-option value="20-99人">20-99人</a-select-option>
                      <a-select-option value="100-499人">100-499人</a-select-option>
                      <a-select-option value="500-999人">500-999人</a-select-option>
                      <a-select-option value="1000-9999人">1000-9999人</a-select-option>
                      <a-select-option value="10000人以上">10000人以上</a-select-option>
                    </a-select>
                  </a-form-item>

                  <a-form-item label="所属行业" name="industryInvolved">
                    <a-select placeholder="请选择" v-model:value="form.formAllclinent.industryInvolved">
                      <a-select-option value="计算机软件/硬件">计算机软件/硬件</a-select-option>
                      <a-select-option value="计算机系统/维修">计算机系统/维修</a-select-option>
                      <a-select-option value="通信(设备/运营/服务)">通信(设备/运营/服务)</a-select-option>
                      <a-select-option value="互联网/电子商务">互联网/电子商务</a-select-option>
                      <a-select-option value="网络游戏">网络游戏</a-select-option>
                      <a-select-option value="电子/半导体/集成电路">电子/半导体/集成电路</a-select-option>
                      <a-select-option value="仪器仪表/工业自动化">仪器仪表/工业自动化</a-select-option>
                      <a-select-option value="会计/审计">会计/审计</a-select-option>
                      <a-select-option value="金融(投资/证券)">金融(投资/证券)</a-select-option>
                      <a-select-option value="金融(银行/保险)">金融(银行/保险)</a-select-option>
                    </a-select>
                  </a-form-item>

                  <a-form-item label="注册资金" name="registeredFund">
                    <a-input v-model:value="form.formAllclinent.registeredFund" placeholder="请输入">
                      <template #addonAfter>
                        <a-select style="width: 120px" placeholder="万人民币">
                          <a-select-option value="万人民币">万人民币</a-select-option>
                          <a-select-option value="万美元">万美元</a-select-option>
                        </a-select>
                      </template>
                    </a-input>
                  </a-form-item>

                  <a-form-item ref="companyURL" label="公司网址" name="companyURL">
                    <a-input v-model:value="form.formAllclinent.companyURL" placeholder="请输入" />
                  </a-form-item>

                  <a-form-item ref="enterpriseWelfare" label="企业福利" name="enterpriseWelfare">
                    <a-select v-model:value="form.formAllclinent.enterpriseWelfare" :options="options" mode="multiple"
                      style="width: 100%" placeholder="请选择(可多选)" />
                  </a-form-item>

                  <a-form-item label="所在地区" name="location">
                    <al-cascader placeholder="请选择" v-model:value="form.formAllclinent.location" level="3"
                      data-type="all" />
                  </a-form-item>

                  <a-form-item ref="ContactAddress" label="联系地址" name="ContactAddress">
                    <a-input v-model:value="form.formAllclinent.ContactAddress" placeholder="请输入" />
                  </a-form-item>

                  <a-form-item ref="companyBrief" label="公司简介" name="companyBrief">
                    <a-input v-model:value="form.formAllclinent.companyBrief" placeholder="请输入" />
                  </a-form-item>

                  <a-form-item label="公司介绍" name="companyIntroduce">
                    <a-textarea :rows="4" v-model:value="form.formAllclinent.companyIntroduce" placeholder="请输入" />
                  </a-form-item>

                  <a-divider style="font-weight: 700;" orientation="left">联系信息</a-divider>

                  <a-form-item ref="contacts" label="联系人" name="contacts">
                    <a-input v-model:value="form.formAllclinent.contacts" placeholder="请输入" />
                  </a-form-item>

                  <a-form-item ref="enterpriseContactWay" label="联系手机" name="enterpriseContactWay">
                    <a-input v-model:value="form.formAllclinent.enterpriseContactWay" placeholder="请输入" />
                  </a-form-item>

                  <a-form-item ref="bindingWechat" label="联系微信" name="bindingWechat">
                    <a-input v-model:value="form.formAllclinent.bindingWechat" placeholder="请输入" />
                  </a-form-item>

                  <a-form-item ref="relationTelephone" label="联系固话" name="relationTelephone">
                    <a-input v-model:value="form.formAllclinent.relationTelephone" placeholder="请输入" />
                  </a-form-item>

                  <a-form-item ref="relationEmail" label="联系邮箱" name="relationEmail">
                    <a-input v-model:value="form.formAllclinent.relationEmail" placeholder="请输入" />
                  </a-form-item>

                  <a-form-item ref="relationQQ" label="联系QQ" name="relationQQ">
                    <a-input v-model:value="form.formAllclinent.relationQQ" placeholder="请输入" />
                  </a-form-item>

                  <a-form-item :wrapper-col="{ span: 5, offset: 4 }">
                    <a-button style="width: 110px;" type="primary" @click="onSubmit">保存</a-button>
                  </a-form-item>

                </a-form>
              </a-col>
              <a-col style="padding-left: 30px;" :span="12">
                <div style="font-weight: 800; font-size: 18px;">
                  企业风采
                </div>
                <div style="margin-top: 40px;">
                  <a-upload v-model:file-list="form.formAllclinent.logo" name="avatar" list-type="picture-card"
                    :show-upload-list="false" action="https://www.mocky.io/v2/5cc8019d300000980a055e76"
                    :before-upload="beforeUpload" @change="handleChanges">
                    <img v-if="imageUrl" :src="imageUrl" alt="avatar" />
                    <div v-else>
                      <loading-outlined v-if="loading"></loading-outlined>
                      <plus-outlined v-else></plus-outlined>
                      <div class="ant-upload-text">
                        <PlusCircleOutlined style="color: #8c939d; fontSize: 8rem" />
                      </div>
                    </div>
                  </a-upload>
                </div>
                <div style="font-weight: 800; font-size: 18px; margin-top: 80px;">
                  短视频招聘
                </div>
                <div style="width: 100%; margin-top: 20px; display: grid; align-items:center; justify-content: center;">
                  <img style="width: 180px; height: 150px;"
                    src="http://houtai.74cmsse.tywangcai.com/admin/static/img/zanwei.15584ae2.png" alt="">
                  <span style="color: #d5d3d3; font-size: 12px; text-align: center;">暂未上传短视频</span>
                </div>
              </a-col>
            </a-row>
          </a-tab-pane>
          <a-tab-pane key="4" tab="联系人" force-render style="display: flex;">
            <div
              style="width: 300px; height: 250px; border-radius: 5px; border: 1px solid #ebeef5; background: #f3f3f3;">
              <div style="background: #fff; padding: 20px; position: relative;">
                <h1 style="font-size: 26px; display: inline-block; line-height: 18px;">{{ form.formAllclinent.contacts
                }}
                </h1>
                <div
                  style="width: 130px; height: 20px; text-align: center; line-height: 20px; color: #fff; background: #ff6000; border-radius: 15px; border: 1px solid #ff6000; vertical-align: top; display: inline-block; position: absolute; right: 20px; font-size: 10px;">
                  企业联系方式
                </div>
                <div
                  style="width: 100%; height: 35px; line-height: 35px; font-size: 14px; font-weight: 700; border-bottom: 1px solid #ebeef5;">
                  <span>{{ form.formAllclinent.enterpriseContactWay }}</span>
                  <span><img style="width: 15px; height: 15px; margin-left: 10px; vertical-align: middle;"
                      src="@/assets/phone电话.png" alt=""></span>
                </div>
                <div>
                  <div style="margin-top: 8px;">
                    <span>座机：</span>
                    <span>-</span>
                  </div>
                  <div style="margin-top: 8px;">
                    <span>QQ：</span>
                    <span>-</span>
                  </div>
                  <div style="margin-top: 8px;">
                    <span>邮箱：</span>
                    <span>-</span>
                  </div>
                </div>
              </div>
            </div>
            <div
              style="width: 300px; height: 250px; border-radius: 5px; border: 1px solid #ebeef5; background: #f3f3f3; margin-left: 30px; position: relative;">
              <div style="background: #fff; padding: 20px;">
                <h1 style="font-size: 26px; display: inline-block; line-height: 18px;">
                  会员账号
                </h1>
                <div
                  style="width: 130px; height: 20px; text-align: center; line-height: 20px; color: #fff; background: #ff6000; border-radius: 15px; border: 1px solid #ff6000; vertical-align: top; display: inline-block; position: absolute; right: 20px; font-size: 10px;">
                  会员联系方式
                </div>
                <div
                  style="width: 100%; height: 35px; line-height: 35px; font-size: 14px; font-weight: 700; border-bottom: 1px solid #ebeef5;">
                  <span>{{ form.formAllclinent.memberContactWay }}</span>
                  <span><img style="width: 15px; height: 15px; margin-left: 10px; vertical-align: middle;"
                      src="@/assets/phone电话.png" alt=""></span>
                </div>
                <div>
                  <div style="margin-top: 8px;">
                    <span>座机：</span>
                    <span>-</span>
                  </div>
                  <div style="margin-top: 8px;">
                    <span>QQ：</span>
                    <span>-</span>
                  </div>
                  <div style="margin-top: 8px;">
                    <span>邮箱：</span>
                    <span>-</span>
                  </div>
                </div>
              </div>
            </div>
            <div
              style="width: 300px; cursor: pointer; height: 250px; border-radius: 5px; border: 1px solid #ebeef5; background: #fcfcfc; margin-left: 30px; position: relative;">
              <div style="line-height: 250px; text-align: center; font-size: 18px; font-weight: 900;">添加联系人</div>
            </div>
          </a-tab-pane>
          <a-tab-pane key="5" tab="在招职位" force-render>
            <a-tabs type="card" v-model:activeKey="activeKeys">
              <a-tab-pane key="1" tab="招聘中职位">
                <a-table :columns="columnsTab" :data-source="dataTab"></a-table>
                <div style="display: flex; margin-top: 20px;">
                  <a-button type="primary">审核</a-button>
                  <a-button style="margin-left: 20px;" type="primary">刷新</a-button>
                  <a-pagination style="align-self: center; position: absolute; right: 20px;" size="small" :total="total"
                    show-size-changer show-quick-jumper :show-total="(total: any) => `总共
                    ${total} 项`" :pageSizeOptions="['1', '3', '5', '10']" v-model:pageSize="pageSize"
                    v-model:current="current" />
                </div>
              </a-tab-pane>
              <a-tab-pane key="2" tab="审核中职位">
                <a-table :columns="columnsTab" :data-source="dataTab"></a-table>
                <div style="display: flex; margin-top: 20px;">
                  <a-button type="primary">审核</a-button>
                  <a-pagination style="align-self: center; position: absolute; right: 20px;" size="small" :total="total"
                    show-size-changer show-quick-jumper :show-total="(total: any) => `总共
                    ${total} 项`" :pageSizeOptions="['1', '3', '5', '10']" v-model:pageSize="pageSize"
                    v-model:current="current" />
                </div>
              </a-tab-pane>
              <a-tab-pane key="3" tab="已下线职位">
                <a-table :columns="columnsTab" :data-source="dataTab"></a-table>
                <div style="display: flex; margin-top: 20px;">
                  <a-button type="primary">审核</a-button>
                  <a-pagination style="align-self: center; position: absolute; right: 20px;" size="small" :total="total"
                    show-size-changer show-quick-jumper :show-total="(total: any) => `总共
                    ${total} 项`" :pageSizeOptions="['1', '3', '5', '10']" v-model:pageSize="pageSize"
                    v-model:current="current" />
                </div>
              </a-tab-pane>
            </a-tabs>
          </a-tab-pane>
          <a-tab-pane key="6" tab="招聘动态" force-render>
            <a-tabs type="card" v-model:activeKey="activeKeysOne">
              <a-tab-pane key="1" tab="收到投递">
                <a-table :columns="columnsTabOne" :data-source="dataTabOne" :pagination="{
                  total: 0,
                  PageSize: 3,
                  showTotal: (total: any) => `共 ${total} 条数据`,
                  showSizeChanger: true,
                  pageSizeOptions: ['1', '3', '5', '10']
                }" />
              </a-tab-pane>
              <a-tab-pane key="2" tab="主动下载">
                <a-table :columns="columnsTabTwo" :data-source="dataTabTwo" :pagination="{
                  total: 0,
                  PageSize: 3,
                  showTotal: (total: any) => `共 ${total} 条数据`,
                  showSizeChanger: true,
                  pageSizeOptions: ['1', '3', '5', '10']
                }" />
              </a-tab-pane>
              <a-tab-pane key="3" tab="近期查看">
                <a-table :columns="columnsTabThree" :data-source="dataTabThree" :pagination="{
                  total: 0,
                  PageSize: 3,
                  showTotal: (total: any) => `共 ${total} 条数据`,
                  showSizeChanger: true,
                  pageSizeOptions: ['1', '3', '5', '10']
                }" />
              </a-tab-pane>
              <a-tab-pane key="4" tab="职位被查看">
                <a-table :columns="columnsTabFour" :data-source="dataTabFour" :pagination="{
                  total: 0,
                  PageSize: 3,
                  showTotal: (total: any) => `共 ${total} 条数据`,
                  showSizeChanger: true,
                  pageSizeOptions: ['1', '3', '5', '10']
                }" />
              </a-tab-pane>
            </a-tabs>
          </a-tab-pane>
          <a-tab-pane key="7" tab="订单记录" force-render>
            <a-select v-model:value="ServiceTypeSelect" style="width: 150px" placeholder="服务类型">
              <a-select-option value="开通套餐">开通套餐</a-select-option>
              <a-select-option value="充值积分">充值积分</a-select-option>
              <a-select-option value="职位置顶">职位置顶</a-select-option>
              <a-select-option value="职位紧急">职位紧急</a-select-option>
              <a-select-option value="简历增值包">简历增值包</a-select-option>
              <a-select-option value="职聊增值包">职聊增值包</a-select-option>
              <a-select-option value="职位智能刷新">职位智能刷新</a-select-option>
              <a-select-option value="快捷支付-刷新职位">快捷支付-刷新职位</a-select-option>
              <a-select-option value="快捷支付-下载简历">快捷支付-下载简历</a-select-option>
            </a-select>
            <a-select v-model:value="PaymentMethodSelect" style="width: 150px; margin-left: 20px; margin-bottom: 20px;"
              placeholder="支付方式">
              <a-select-option value="免费开通">免费开通</a-select-option>
              <a-select-option value="微信支付">微信支付</a-select-option>
              <a-select-option value="支付宝">支付宝</a-select-option>
              <a-select-option value="优惠卷兑换">优惠卷兑换</a-select-option>
              <a-select-option value="积分兑换">积分兑换</a-select-option>
              <a-select-option value="后台开通">后台开通</a-select-option>
            </a-select>
            <a-table :columns="columnsTabFive" :data-source="dataTabFive" :pagination="{
              total: 0,
              PageSize: 3,
              showTotal: (total: any) => `共 ${total} 条数据`,
              showSizeChanger: true,
              pageSizeOptions: ['1', '3', '5', '10']
            }" />
          </a-tab-pane>
          <a-tab-pane key="8" tab="积分记录" force-render>
            <a-tabs type="card" v-model:activeKey="activeKeysTwo">
              <a-tab-pane key="1" tab="收到投递">
                <a-table :columns="columnsTabSix" :data-source="dataTabSix" :pagination="{
                  total: 0,
                  PageSize: 3,
                  showTotal: (total: any) => `共 ${total} 条数据`,
                  showSizeChanger: true,
                  pageSizeOptions: ['1', '3', '5', '10']
                }" />
              </a-tab-pane>
              <a-tab-pane key="2" tab="主动下载">
                <a-table :columns="columnsTabSeven" :data-source="dataTabSeven" :pagination="{
                  total: 0,
                  PageSize: 3,
                  showTotal: (total: any) => `共 ${total} 条数据`,
                  showSizeChanger: true,
                  pageSizeOptions: ['1', '3', '5', '10']
                }" />
              </a-tab-pane>
            </a-tabs>
          </a-tab-pane>
          <a-tab-pane key="9" tab="操作日志" force-render>
            <a-input-search v-model:value="OperationSearch" placeholder="请输入关键字"
              style="width: 200px; position: absolute; right: 10px; z-index: 999;" @search="onSearch"
              v-show="activeKeysThree === '1'" />
            <a-tabs type="card" v-model:activeKey="activeKeysThree">
              <a-tab-pane key="1" tab="收到投递">
                <a-table :columns="columnsTabEight" :data-source="dataTabEight" :pagination="{
                  total: 0,
                  PageSize: 3,
                  showTotal: (total: any) => `共 ${total} 条数据`,
                  showSizeChanger: true,
                  pageSizeOptions: ['1', '3', '5', '10']
                }" />
              </a-tab-pane>
              <a-tab-pane key="2" tab="主动下载">
                <a-table :columns="columnsTabNine" :data-source="dataTabNine" :pagination="{
                  total: 0,
                  PageSize: 3,
                  showTotal: (total: any) => `共 ${total} 条数据`,
                  showSizeChanger: true,
                  pageSizeOptions: ['1', '3', '5', '10']
                }" />
              </a-tab-pane>
            </a-tabs>
          </a-tab-pane>
        </a-tabs>
      </div>
    </a-drawer>
  </a-card>
</template>

<script lang="ts" setup>
import { ref, computed, onMounted, reactive, createVNode, defineComponent } from "vue";
import { SearchOutlined, UploadOutlined, PlusCircleOutlined, ExclamationCircleOutlined } from "@ant-design/icons-vue";
import AlCascader from "@/components/AlCascader/al-cascader.vue"
import { useRouter } from 'vue-router'
import { message, Modal } from "ant-design-vue";
const SearchType = ref("公司名称");
const SearchContent = ref("");
const OperationSearch = ref("");
const labelCol = ref({ span: 4 });
const wrapperCol = ref({ span: 17 });
const total = ref(0);
const ServiceTypeSelect = ref(undefined)
const PaymentMethodSelect = ref(undefined)
const activeKeysThree = ref("1");
const activeKeysTwo = ref("1");
const activeKeysOne = ref("1");
const activeKeys = ref("1");
const imageUrl = ref<string>('');
const loading = ref<boolean>(false);
const RadioclientGrade = ref("0");
const pageSize = ref<Number>(3)
const current = ref<Number>(1)
const activeKey = ref("1");
const options: { value: string; }[] = [
  { value: "环境好" },
  { value: "年终奖" },
  { value: "双休" },
  { value: "五险一金" },
  { value: "加班费" },
  { value: "朝九晚五" },
  { value: "交通方便" },
  { value: "加班补助" },
  { value: "包食宿" },
  { value: "管理规范" },
  { value: "有提成" },
  { value: "全勤奖" },
  { value: "有年假" },
  { value: "专车接送" },
  { value: "有补助" },
  { value: "晋升快" },
  { value: "车贴" },
  { value: "房贴" },
  { value: "压力小" },
  { value: "技术培训" },
  { value: "旅游" },
];
const columns = ref([
  { title: "企业ID", dataIndex: "enterpriseId", key: "1", width: 100 },
  { title: "企业名称", dataIndex: "enterpriseName", key: "2", width: 150 },
  { title: "所属行业", dataIndex: "industryInvolved", key: "3", width: 150 },
  { title: "所在地区", dataIndex: "location", key: "4", width: 150 },
  { title: "绑定微信", dataIndex: "bindingWechat", key: "5", width: 150, slots: { customRender: "5" } },
  { title: "客户等级", dataIndex: "clientGrade", key: "6", width: 150, slots: { customRender: "6" } },
  { title: "联系人", dataIndex: "contacts", key: "7", width: 150 },
  { title: "企业联系方式", dataIndex: "enterpriseContactWay", key: "8", width: 150 },
  { title: "会员联系方式", dataIndex: "memberContactWay", key: "9", width: 150 },
  { title: "在招职位", dataIndex: "position", key: "10", width: 150 },
  { title: "收到简历", dataIndex: "receiptNotification", key: "11", width: 150 },
  { title: "企业套餐", dataIndex: "enterpriseSetmeal", key: "12", width: 150 },
  { title: "套餐剩余(天)", dataIndex: "setmealResidue", key: "13", width: 150 },
  { title: "刷新时间", dataIndex: "refreshTime", key: "14", width: 150 },
  { title: "注册时间", dataIndex: "registrationTime", key: "15", width: 150 },
  { title: "登录时间", dataIndex: "loginTime", key: "16", width: 150 },
  { title: "所属销售", dataIndex: "involvedMarket", key: "17", width: 150 },
  { title: "认证状态", dataIndex: "authenticationStatus", key: "18", width: 150, slots: { customRender: "18" } },
  { title: "显示状态", dataIndex: "displayStatus", key: "19", width: 150, slots: { customRender: "19" } },
  { title: "最后跟进", dataIndex: "finallyFollowup", key: "20", width: 150, slots: { customRender: "20" } },
  { title: "未跟进(天)", dataIndex: "notFollowup", key: "21", width: 150, slots: { customRender: "21" } },
  {
    title: "操作",
    key: "operation",
    fixed: "right",
    width: 170,
    slots: { customRender: "operation" },
  },
]);
const columnsTab = ref([
  { title: "职位名称", dataIndex: "JobTitle", key: "1" },
  { title: "职位要求", dataIndex: "JobRequirements", key: "2" },
  { title: "薪资待遇", dataIndex: "SalaryPackage", key: "3" },
  { title: "招聘人数", dataIndex: "NumberRecruits", key: "4" },
  { title: "联系方式", dataIndex: "ContactInformation", key: "5" },
  { title: "更新时间", dataIndex: "UpdateTime", key: "6" },
  { title: "职位状态", dataIndex: "JobStatus", key: "7" },
  { title: "收到简历", dataIndex: "receiveResume", key: "8" },
  {
    title: "操作",
    key: "operation",
    fixed: "right",
    slots: { customRender: "operation" },
  },
])
const dataTab = ref([])
const columnsTabOne = ref([
  { title: "简历名称", dataIndex: "ResumeName", key: "1" },
  { title: "求职意向", dataIndex: "JobSearchIntention", key: "2" },
  { title: "投递职位", dataIndex: "PostJob", key: "3" },
  { title: "投递时间", dataIndex: "DeliveryTime", key: "4" },
  { title: "是否查看", dataIndex: "WhetherCheck", key: "5" },
  { title: "是否面邀", dataIndex: "WhetherInvite", key: "6" },
  {
    title: "操作",
    key: "operation",
    fixed: "right",
    slots: { customRender: "operation" },
  },
])
const dataTabOne = ref([])
const columnsTabTwo = ref([
  { title: "简历名称", dataIndex: "ResumeName", key: "1" },
  { title: "求职意向", dataIndex: "JobSearchIntention", key: "2" },
  { title: "下载时间", dataIndex: "PostTime", key: "3" },
  {
    title: "操作",
    key: "operation",
    fixed: "right",
    slots: { customRender: "operation" },
  },
])
const dataTabTwo = ref([])
const columnsTabThree = ref([
  { title: "简历名称", dataIndex: "ResumeName", key: "1" },
  { title: "求职意向", dataIndex: "JobSearchIntention", key: "2" },
  { title: "浏览时间", dataIndex: "BrowseTime", key: "3" },
  {
    title: "操作",
    key: "operation",
    fixed: "right",
    slots: { customRender: "operation" },
  },
])
const dataTabThree = ref([])
const columnsTabFour = ref([
  { title: "简历名称", dataIndex: "ResumeName", key: "1" },
  { title: "求职意向", dataIndex: "JobSearchIntention", key: "2" },
  { title: "浏览职位", dataIndex: "BrowseJobs", key: "3" },
  { title: "浏览时间", dataIndex: "BrowseTime", key: "4" },
  {
    title: "操作",
    key: "operation",
    fixed: "right",
    slots: { customRender: "operation" },
  },
])
const dataTabFour = ref([])
const columnsTabFive = ref([
  { title: "服务内容", dataIndex: "ServiceContent", key: "1" },
  { title: "订单金额", dataIndex: "OrderAmount", key: "2" },
  { title: "支付方式", dataIndex: "PaymentMethod", key: "3" },
  { title: "下单时间", dataIndex: "OrderTime", key: "4" },
  { title: "付款时间", dataIndex: "PaymentTime", key: "5" },
  {
    title: "操作",
    key: "operation",
    fixed: "right",
    slots: { customRender: "operation" },
  },
])
const dataTabFive = ref([])
const columnsTabSix = ref([
  { title: "积分来源", dataIndex: "ServiceContent", key: "1" },
  { title: "类型", dataIndex: "Type", key: "2" },
  { title: "时间", dataIndex: "Time", key: "3" },
  { title: "积分", dataIndex: "OrderTime", key: "4" },
  {
    title: "操作",
    key: "operation",
    fixed: "right",
    slots: { customRender: "operation" },
  },
])
const dataTabSix = ref([])
const columnsTabSeven = ref([
  { title: "内容", dataIndex: "Content", key: "1" },
  { title: "时间", dataIndex: "Time", key: "2" }
])
const dataTabSeven = ref([])
const columnsTabEight = ref([
  { title: "时间", dataIndex: "ServiceContent", key: "1" },
  {
    title: "操作",
    key: "operation",
    fixed: "right",
    slots: { customRender: "operation" },
  },
  { title: "IP", dataIndex: "OrderAmount", key: "2" },
  { title: "IP归属地", dataIndex: "PaymentMethod", key: "3" },
  { title: "来源", dataIndex: "OrderTime", key: "4" }
])
const dataTabEight = ref([])
const columnsTabNine = ref([
  { title: "时间", dataIndex: "ServiceContent", key: "1" },
  {
    title: "操作",
    key: "operation",
    fixed: "right",
    slots: { customRender: "operation" },
  },
  { title: "IP", dataIndex: "OrderAmount", key: "2" },
  { title: "IP归属地", dataIndex: "PaymentMethod", key: "3" },
  { title: "来源", dataIndex: "OrderTime", key: "4" }
])
const dataTabNine = ref([])
interface DataItem {
  enterpriseId: number, // 企业ID
  username: string, // 用户名
  password: string, // 密码
  logo: string, // logo图片
  enterpriseAbbreviation: string, // 企业简称
  enterpriseNature: undefined, // 企业性质
  enterpriseShort: string, // 企业名称
  CompanySpecification: undefined, // 公司规格
  registeredFund: string, // 注册资金
  relationTelephone: string, // 联系固话
  relationEmail: string, // 联系邮箱
  relationQQ: string, // 联系QQ
  presentIntegral: number, // 赠送积分
  chargeAmount: number, // 收费金额
  companyURL: string, // 公司网址
  companyBrief: string, // 公司简介
  companyIntroduce: string, // 公司介绍
  enterpriseWelfare: [], // 企业福利
  ContactAddress: string, // 联系地址
  enterpriseName: string, // 企业名称
  industryInvolved: string, // 所属行业
  location: string, // 所在地区
  bindingWechat: string, // 绑定微信
  clientGrade: number, // 客户等级
  contacts: string, // 联系人
  enterpriseContactWay: number, // 企业联系方式
  memberContactWay: number, // 会员联系方式
  position: number, // 在招职位
  receiptNotification: number, // 收到简历
  enterpriseSetmeal: string, // 企业套餐
  setmealResidue: string, // 套装剩余
  refreshTime: string, // 刷新时间
  registrationTime: string, // 注册时间
  loginTime: string, // 登陆时间
  involvedMarket: string, // 所属销售
  authenticationStatus: number, // 认证状态
  displayStatus: Boolean, // 显示状态
  finallyFollowup: string, // 最后跟进
  notFollowup: string, // 未跟进
}
const data: DataItem[] = [
  {
    enterpriseId: 0, // 企业ID
    username: "哈哈哈哈哈", // 用户名
    password: "123456", // 密码
    logo: "string", // logo图片
    enterpriseAbbreviation: "string", // 企业简称
    enterpriseNature: undefined, // 企业性质
    enterpriseShort: "string", // 企业名称
    CompanySpecification: undefined, // 公司规格
    registeredFund: "string", // 注册资金
    relationTelephone: "string", // 联系固话
    relationEmail: "string", // 联系邮箱
    relationQQ: "string", // 联系QQ
    presentIntegral: 0, // 赠送积分
    chargeAmount: 0, // 收费金额
    companyURL: "string", // 公司网址
    companyBrief: "string", // 公司简介
    companyIntroduce: "string", // 公司介绍
    enterpriseWelfare: [], // 企业福利
    ContactAddress: "string", // 联系地址
    enterpriseName: "测试", // 企业名称
    industryInvolved: "计算机软件/硬件", // 所属行业
    location: "北京", // 所在地区
    bindingWechat: "19678421669", // 绑定微信
    clientGrade: 0, // 客户等级
    contacts: "Siri", // 联系人
    enterpriseContactWay: 3369858, // 企业联系方式
    memberContactWay: 19678421669, // 会员联系方式
    position: 0, // 在招职位
    receiptNotification: 0, // 收到简历
    enterpriseSetmeal: '2', // 企业套餐
    setmealResidue: "无限期", // 套装剩余
    refreshTime: "2022-1-21", // 刷新时间
    registrationTime: "2022-1-21", // 注册时间
    loginTime: "2022-1-21", // 登陆时间
    involvedMarket: "admin", // 所属销售
    authenticationStatus: 1, // 认证状态
    displayStatus: true, // 显示状态
    finallyFollowup: "", // 最后跟进
    notFollowup: "", // 未跟进
  }
];
const rowSelection = {
  fixed: "left",
  onChange: (
    selectedRowKeys: (string | number)[],
    selectedRows: DataItem[]
  ) => {
    console.log(
      `selectedRowKeys: ${selectedRowKeys}`,
      "selectedRows: ",
      selectedRows,
      123
    );
  },
  onSelect: (record: DataItem, selected: boolean, selectedRows: DataItem[]) => {
    console.log(record, selected, selectedRows, 456);
  },
  onSelectAll: (
    selected: boolean,
    selectedRows: DataItem[],
    changeRows: DataItem[]
  ) => {
    console.log(selected, selectedRows, changeRows, 798);
  },
};
const router = useRouter()
const visible = ref<boolean>(false);
const form = reactive({
  formAllclinent: {
    username: "", // 用户名
    password: "", // 密码
    logo: [], // logo图片
    enterpriseAbbreviation: "", // 企业简称
    enterpriseNature: undefined, // 企业性质
    enterpriseShort: "", // 企业名称
    CompanySpecification: undefined, // 公司规格
    registeredFund: "", // 注册资金
    relationTelephone: "", // 联系固话
    relationEmail: "", // 联系邮箱
    relationQQ: "", // 联系QQ
    presentIntegral: 0, // 赠送积分
    chargeAmount: 0, // 收费金额
    companyURL: "", // 公司网址
    companyBrief: "", // 公司简介
    companyIntroduce: "", // 公司介绍
    enterpriseWelfare: [], // 企业福利
    ContactAddress: "", // 联系地址
    enterpriseName: "", // 企业名称
    industryInvolved: undefined, // 所属行业
    location: [], // 所在地区
    bindingWechat: "", // 绑定微信
    clientGrade: "", // 客户等级
    contacts: "", // 联系人
    enterpriseContactWay: "", // 企业联系方式
    memberContactWay: "", // 会员联系方式 | 添加页面手机号
    position: "", // 在招职位
    receiptNotification: "", // 收到简历
    enterpriseSetmeal: "3", // 企业套餐
    setmealResidue: "", // 套装剩余
    refreshTime: "", // 刷新时间
    registrationTime: "", // 注册时间
    loginTime: "", // 登陆时间
    involvedMarket: "1", // 所属销售
    authenticationStatus: "1", // 认证状态
    displayStatus: "", // 显示状态
    finallyFollowup: "", // 最后跟进
    notFollowup: "", // 未跟进
  },
});

const CreateWhole = () => {
  router.push("/user/compony/allclientAdd")
}

const handleChange = (info: any) => {
  const status = info.file.status;
  if (status !== "uploading") {
    console.log(info.file, info.fileList);
  }
  if (status === "done") {
    message.success(`${info.file.name} file uploaded successfully.`);
  } else if (status === "error") {
    message.error(`${info.file.name} file upload failed.`);
  }
};

function getBase64(img: Blob, callback: (base64Url: string) => void) {
  const reader = new FileReader();
  reader.addEventListener('load', () => callback(reader.result as string));
  reader.readAsDataURL(img);
}

const handleChanges = (info: any) => {
  if (info.file.status === 'uploading') {
    loading.value = true;
    return;
  }
  if (info.file.status === 'done') {
    // Get this url from response in real world.
    getBase64(info.file.originFileObj, (base64Url: string) => {
      imageUrl.value = base64Url;
      loading.value = false;
    });
  }
  if (info.file.status === 'error') {
    loading.value = false;
  }
};

const beforeUpload = (file: any) => {
  const isJpgOrPng = file.type === 'image/jpeg' || file.type === 'image/png';
  if (!isJpgOrPng) {
  }
  const isLt2M = file.size / 1024 / 1024 < 2;
  if (!isLt2M) {
  }
  return isJpgOrPng && isLt2M;
};

const Examine = (item: any, type: any) => {
  if (type === "ck") {
    visible.value = true;
    form.formAllclinent = item;
  } else if (type === "sf") {
    Modal.confirm({
      title: () => '确定要释放该企业',
      icon: () => createVNode(ExclamationCircleOutlined),
      onOk() {
        console.log('OK');
      },
      onCancel() {
        console.log('Cancel');
      },
      class: 'test',
    });
  } else {
    visible.value = true;
    form.formAllclinent = item;
  }
};

const focus = () => {
  console.log(123);
};

const onSubmit = () => {
  console.log(123);
};

const onSearch = () => {
  console.log(123);
};

onMounted(() => {
  total.value = data.length;

});
</script>

<style lang="scss">
// 头部搜索模块
.HeadrSearch {
  width: 100%;
  display: flex;

  .ant-select-single:not(.ant-select-customize-input) .ant-select-selector {
    height: 45px;
  }

  .ant-select-single .ant-select-selector .ant-select-selection-item,
  .ant-select-single .ant-select-selector .ant-select-selection-placeholder {
    width: 105px;
    line-height: 43px;
  }


  .ant-input {
    height: 45px;
  }

  .ant-btn-icon-only {
    width: 55px;
    height: 45px;
    background: #f5f7fa;
    border-color: #dcdfe6;
  }

  .ant-btn-icon-only:hover {
    width: 55px;
    height: 45px;
    background: #f5f7fa;
    border-color: #dcdfe6;
  }
}

.TableCentent {
  width: 100%;
  margin-top: 30px;
}

.drawerHeater {
  width: 100%;

  .details {
    width: 100%;
  }

  .drawerHeater-left {
    img {
      height: 100px;
    }
  }

  .drawerHeater-right {

    p,
    h3 {
      margin: 0;
      padding: 0;
    }

    h3 {
      font-size: 30px;
    }

    .drawerHeater-right-top {
      display: flex;
      align-items: center;

      h3 {
        margin-right: 12px;
      }
    }
  }

  .details {
    width: 100%;
  }

  .drawerTab {
    width: 100%;
  }
}

.drawerTab_Ul {
  width: 100%;
  margin-left: 18px;
  border-right: 1px solid #ebeef5;

  li {
    width: 100%;
    height: 50px;
    line-height: 50px;
    border-bottom: 1px solid #ebeef5;

    label {
      color: #999999;
      font-size: 13px;
    }
  }

  li:first-child {
    margin-top: 0;
  }
}
</style>